﻿<!-- #layout name=blank-->
<div class="page-header">
    <h1 class="title">Diagnosis</h1>
</div>
<div data-bind="component: { name: 'kb-breadcrumb', params:[{
    name: 'SITES'
},{
    name: 'DASHBOARD'
},{
    name: Kooboo.text.common.diagnosis
}]}"></div>
<div class="navbar navbar-default" data-bind="visible: !isScanningView()">
    <div class="container-fluid">
        <a class="btn green navbar-btn" data-bind="attr: { href: diagnosisCodeURL }">Add custom item</a>
    </div>
</div>
<div class="row" id="diagnostics">
    <div class="col-md-12">
        <div class="kb-site-diagnose" data-bind="visible:!isScanningView()">
            <div class="panel panel-blue">
                <div class="panel-heading">
                    <button class="btn green btn-lg" id="scan" data-toggle="tooltip" data-placement="top" title="Please choose the items below" data-trigger="click">Scan now</button>
                    <div class="message">
                        <h6 class="title">Choose the items to start scanning</h6>
                    </div>
                </div>
                <div class="panel-body">
                    <div id="J_ScanItems">
                        <ul>
                            <!-- ko foreach: { data: diagnosticItems, as: 'item' } -->
                            <li>
                                <span data-bind="text: item.key"></span>
                                <ul data-bind="foreach: { data: item.values, as: 'val' }">
                                    <li data-bind="attr: { 'data-itemid': val.id }">
                                        <span data-bind="text: val.name"></span>
                                    </li>
                                </ul>
                            </li>
                            <!-- /ko -->
                        </ul>
                    </div>
                </div>
            </div>
        </div>
        <div class="kb-site-diagnose" data-bind="visible:isScanningView">
            <div class="panel panel-blue">
                <div class="panel-heading">
                    <a class="btn green btn-lg" href="javascript:;" data-bind="click: endScan, text:cancelBtnText"></a>
                    <div class="message">
                        <h6 class="title"><strong data-bind="text:issueNumber"></strong> <span>issues found</span></h6>
                        <p data-bind="text:scanPage"></p>
                    </div>
                </div>
                <div class="progress progress-striped active">
                    <div id="progressBar" data-bind="style:{width:percent}" class="progress-bar progress-bar-success"></div>
                </div>
                <div class="panel-body">
                    <table class="table" style="margin-top: -16px; margin-bottom: -15px;">
                        <tbody data-bind="fastForEach: messages">
                            <tr>
                                <td>
                                    <span data-bind="attr: { class: 'label label-sm label-'+$data.class }, text: $data.typeText"></span>
                                    <span data-bind="html: $data.body"></span>
                                </td>
                            </tr>
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
    </div>
</div>
<script>
    (function() {
        Kooboo.loadJS([
            "/_Admin/Scripts/kooboo/Guid.js",
            "/_Admin/Scripts/components/kbBreadcrumb.js",
            "/_Admin/Scripts/lib/jstree.min.js",
            "/_Admin/Scripts/tableModel.js"
        ])
        Kooboo.loadCSS([
            "/_Admin/Styles/jstree/style.min.css"
        ])
    })()
</script>
<script src="/_Admin/View/Sites/Diagnosis.js"></script>